import { onMounted, ref, onBeforeUnmount } from 'vue'
export function fn () {
  onMounted(() => {
    window.addEventListener('scroll', scrollEvent)
  })
  onBeforeUnmount(() => {
    window.removeEventListener('scroll', scrollEvent)
  })
  const y = ref(0)
  const scrollEvent = () => {
    //  scrollTop:它有兼容性问题，
    y.value =
      document.documentElement.scrollTop ||
      window.pageYOffset ||
      document.body.scrollTop
    // console.log(y.value)
  }
  return { y }
}
// 接口懒加载方法封装
import { useIntersectionObserver } from '@vueuse/core'
export function lazyApi (fn: () => void) {
  const target = ref(null)
  const { stop } = useIntersectionObserver(
    target,
    ([{ isIntersecting }], options) => {
      // console.log('options', options)

      if (isIntersecting) {
        // 接口懒加载：监听当前组件是否进入可视区域，进入就可始调用接口，且停止监听
        fn()
        stop()
      }
    },
    {
      threshold: 0 // 它的值是0-1范围相对于当前的target的dom的占比值
    }
  )
  return target
}
